<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script src="/static/skulpt-demo/js/jquery-1.7.2.min.js"></script>
     <link rel="stylesheet" href="/static/codemirror/lib/codemirror.css">
    <link rel="stylesheet" href="/static/codemirror/addon/fold/foldgutter.css">
    <link rel="stylesheet" href="/static/codemirror/addon/hint/show-hint.css">
    <link rel="stylesheet" href="/static/codemirror/addon/lint/lint.css">
    <link rel="stylesheet" type="text/css" media="all" href="/static/skulpt-demo/css/solarized.css">
    <script src="/static/codemirror/lib/codemirror.js"></script>
    <script src="/static/codemirror/addon/comment/comment.js"></script>
    <script src="/static/codemirror/addon/selection/active-line.js"></script>
    <script src="/static/codemirror/keymap/sublime.js"></script>
    <script src="/static/codemirror/addon/hint/show-hint.js"></script>
    <script src="/static/codemirror/mode/python/python.js"></script>
    <script src="/static/codemirror/addon/fold/foldcode.js"></script>
    <script src="/static/codemirror/addon/fold/foldgutter.js"></script>
    <script src="/static/codemirror/addon/fold/brace-fold.js"></script>
    <script src="/static/codemirror/addon/fold/indent-fold.js"></script>
    <script src="/static/codemirror/addon/fold/comment-fold.js"></script>
    <script src="/static/codemirror/addon/edit/closebrackets.js"></script>
    <script src="/static/codemirror/addon/edit/matchbrackets.js"></script>
    <script src="/static/skulpt-demo/js/editor.js"></script>
    <script src="https://assets.baydn.com/baydn/public/prop-types/15.6.2/prop-types.min.js"></script>
    <script src="/static/skulpt-demo/skulpt.min.js" type="text/javascript"></script>
    <script src="https://assets.baydn.com/baydn/public/skulpt/3.0.1/skulpt-stdlib.js"></script>
    <script src="https://assets.baydn.com/web_static/codetime/python-pygal-3a5117c0589fae275fe5.js"></script>
    <script src="https://assets.baydn.com/web_static/codetime/common-css-b0842825d92b00d455b9.js"></script>
    <script src="https://assets.baydn.com/web_static/codetime/vendor-codeeditordesktop-6b747f0530be834b874f.js"></script>
    <script src="https://assets.baydn.com/web_static/codetime/m-home-css-aecb29c9db8a83f724a3.js"></script>
    <script src="https://assets.baydn.com/web_static/codetime/m-home-ddee1aac39dd968dfbe6.js"></script>
    <link rel="stylesheet" href="/static/css/prism.css">
</head>
<body>
<div id="code_prims"></div>
<div style="text-align: center">
    <div id="mycanvas" class="ac-canvas" height="200" width="200"
            style="display: none; text-align: center;width:200px;height: 200px;"></div>
</div>
<div style='float:left;width:600px'>
    <textarea id="code" cols="85" rows="25">
import turtle

t = turtle.Turtle()

for c in ['red', 'green', 'yellow', 'blue']:
    t.color(c)
    t.forward(75)
    t.left(90)
</textarea>
<button id="run_code">运行</button></div>
<div style='float:left;width:600px'>
<pre id="edoutput" style="background-color:#002b36;text-shadow: #002b36 0 1px;color: white;margin:0"></pre>
</div>
    <script src="/static/js/prism.js"></script>
    <script>
       $('#code_prims').append('<pre class="line-numbers"><code class="language-python">speed = 100\n' +
            'if speed > 60:\n' +
            '    print(\'超速\')\n' +
            'else:\n' +
            '    print(\'未超速\')</code>\n' +
            '</pre>')
    </script>
</body>
</html>